<template>
  <div class="coupon">
    <van-nav-bar
      title="我的优惠券"
      left-arrow
      left-text="返回"
      @click-left="goBack"
    />
     <van-coupon-list
      :show-exchange-bar="showExchangeBar"
      :show-close-button="showCloseButton"
      :coupons="coupons"
      :chosen-coupon="chosenCoupon"
      :disabled-coupons="disabledCoupons"
      @change="onChange"
    />
  </div>
</template>

<script>
  const coupon = {
    id: '1',
    name: 'Vant优惠券',
    available: 1,
    discount: 0,
    denominations: 150,
    originCondition: 0,
    reason: '系统维护中...',
    value: 150,
    startAt: Date.now() / 1000,
    endAt: (Date.now() + 100000000) / 1000
  };
  export default {
    data() {
      return {
        showExchangeBar: false,
        showCloseButton: false,
        chosenCoupon: -1,
        coupons: [coupon],
        disabledCoupons: [coupon]
      }
    },
    methods: {
      goBack() {
        this.$router.go(-1);
      },
      onChange(index) {
        this.chosenCoupon = index;
      },
    },
  }
</script>

<style scoped>

</style>